<template>
  <div>
    <MyProduct
      v-for="item in list"
      :key="item.id"
      :title="item.porname"
      :money="item.porprice"
      :id="item.id"
      @kan="kana"
    />
  </div>
</template>

<script>
import MyProduct from "./components/MyProduct.vue";
export default {
  components: {
    MyProduct,
  },
  data() {
    return {
      msg: "这个口水鸡儿鲜嫩多姿",
      list: [
        {
          id: 1,
          porname: "超级无敌椰子鸡",
          porprice: 888,
        },
        {
          id: 2,
          proname: "超级无敌棒棒鸡",
          porprice: 988,
        },
        {
          id: 3,
          proname: "超级无敌波波鸡",
          porprice: 1888,
        },
      ],
    };
  },
  methods: {
    kana(id) {
      // console.log("sss", id);
      this.list.find((item) => item.id === id).porprice -= 2;
    },
  },
};
</script>

<style scoped>
</style>